import React, {Component} from 'react';
import {connect} from 'dva';
import {routerRedux} from 'dva/router'
import {Card,Row,Col} from 'antd'


import style from './home.less'

import {Tabtitle,NoData} from '../../../components'
import {ReplayInfo,ToolbarWithRangePicker,TableListWithRowClick} from '../components'


const ReplayList = ({dispatch,replayList,location}) =>{
  const {filterValue,begindate,enddate,keywords,list,total}=replayList
  const tag='replayList'
  const toolbarProps={
    begindate:begindate||(total&&total.dataDate),
    enddate:enddate||(total&&total.dataDate),
    dataDate:total&&total.dataDate,
    filterValue,
    keywords,
    dispatch,
    location,
    tag,
    style:{padding:'0 0 15px',borderBottom:'1px #e9e9e9 solid'}
  }
  const totalData=total&&total.trader?[
        {
          name: '总盈利',
          value: total.allTimePnl
        }, {
          name: '交易次数',
          value: total.tradeCount
        }, {
          name: '获利次数',
          value: total.reapProfit
        }, {
          name: '胜率',
          value: total.winRatio
        }, {
          name: '平均收益率',
          value: total.averageReturnRate
        }, {
          name: '市值利用率',
          value: total.utilizationRatio
        }, {
          name: '交易总市值',
          value: total.tradeTotalMarketValue
        }, {
          name: '市值收益率',
          value: total.marketValueYield
        }, {
          name: '获利收益率',
          value: total.profitYield
        }, {
          name: '亏损收益率',
          value: total.lossYield
        }, {
          name: '盈亏比',
          value: total.profitLossRatio
        }, {
          name: '最大单笔亏损',
          value: total.maximumLoss
        }
      ]:[]
  const tableListProps={
    dataSource:list||[],
    columns : [
      {
        title: '交易员',
        dataIndex: 'trader',
        key: 'trader',
        sorter: (a, b) => a.trader - b.trader,
      },
      {
        title: '总盈利',
        dataIndex: 'allTimePnl',
        key: 'allTimePnl',
      	sorter: (a, b) => a.allTimePnl - b.allTimePnl,
      },
      {
        title: '交易次数',
        dataIndex: 'tradeCount',
        key: 'tradeCount',
        sorter: (a, b) => a.tradeCount - b.tradeCount,
      },
      {
        title: '获利次数',
        dataIndex: 'reapProfit',
        key: 'reapProfit',
        sorter: (a, b) => a.reapProfit - b.reapProfit,
      },
      {
        title: '胜率',
        dataIndex: 'winRatio',
        key: 'winRatio',
        sorter: (a, b) => a.winRatio - b.winRatio,
      },
      {
        title: '平均收益率',
        dataIndex: 'averageReturnRate',
        key: 'averageReturnRate',
        sorter: (a, b) => a.averageReturnRate - b.averageReturnRate,
      },
      {
        title: '市值利用率',
        dataIndex: 'utilizationRatio',
        key: 'utilizationRatio',
        sorter: (a, b) => a.utilizationRatio - b.utilizationRatio,
      },
      {
        title: '交易总市值',
        dataIndex: 'tradeTotalMarketValue',
        key: 'tradeTotalMarketValue',
        sorter: (a, b) => a.tradeTotalMarketValue - b.tradeTotalMarketValue,
      },
      {
        title: '市值收益率',
        dataIndex: 'marketValueYield',
        key: 'marketValueYield',
        sorter: (a, b) => a.marketValueYield - b.marketValueYield,
      },
      {
        title: '获利收益率',
        dataIndex: 'profitYield',
        key: 'profitYield',
        sorter: (a, b) => a.profitYield - b.profitYield,
      },
      {
        title: '亏损收益率',
        dataIndex: 'lossYield',
        key: 'lossYield',
        sorter: (a, b) => a.lossYield - b.lossYield,
      },
      {
        title: '盈亏比',
        dataIndex: 'profitLossRatio',
        key: 'profitLossRatio',
        sorter: (a, b) => a.profitLossRatio - b.profitLossRatio,
      },
      {
        title: '最大单笔亏损',
        dataIndex: 'maximumLoss',
        key: 'maximumLoss',
        sorter: (a, b) => a.maximumLoss - b.maximumLoss,
      }
    ],
    rowKey:record => record.trader,
    dispatch,
    tag,
    begindate,
    enddate,
    filterValue,
    rowUrl:"/tradeReplay/investReplayDetail",
  }
	return (
		<div className={`equity ${style.replayList}`}>
			<Tabtitle value={'证投复盘'}/>
			<div className="content-inner">
        <ToolbarWithRangePicker
          {...toolbarProps}
        />
        <Card bordered={false}   >
          {
            totalData&&totalData.length?<ReplayInfo data={totalData} />:null
          }
        </Card>

				<Row>
					<Col>
            {
              list?<TableListWithRowClick
                {...tableListProps}
              />:null
            }

					</Col>
				</Row>

			</div>
		</div>
	)
}

ReplayList.propTypes = {
};

export default connect(({replayList}) => ({replayList}))(ReplayList);
